<!-- 引用编辑器 -->
<link rel="stylesheet" href="/static/kindeditor/themes/default/default.css" />
<script src="/static/kindeditor/kindeditor-all.js"></script>
<script src="/static/kindeditor/lang/zh-CN.js"></script>
<div class="layui-container">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md8 content detail">
      <div class="fly-panel detail-box">
        <h1>{$PostInfo.title}</h1>
        <div class="fly-detail-info">
          <!-- <span class="layui-badge">审核中</span> -->
          <span class="layui-badge layui-bg-green fly-detail-column">{$PostInfo.cate.name}</span>

          {if condition="$PostInfo.accept > 0"}
          <span class="layui-badge" style="background-color: #5FB878;">已结</span>
          {else /}
          <span class="layui-badge" style="background-color: #999;">未结</span>
          {/if}

          {if condition="$PostInfo.state == 1"}
          <span class="layui-badge layui-bg-black">置顶</span>
          {elseif condition="$PostInfo.state == 2"}
          <span class="layui-badge layui-bg-red">精华</span>
          {elseif condition="$PostInfo.state == 3"}
          <span class="layui-badge layui-bg-red">热门</span>
          {/if}

          <div class="fly-admin-box" data-id="123">
            {if condition="$PostInfo.userid == $userid"}
            <span class="layui-btn layui-btn-xs jie-admin del" data-id="{$PostInfo.id}" type="del">删除</span>
            {/if}

            {if condition="$PostInfo.userid != $userid"}
            {if condition="$collect['userid'] == $userid"}
            <span class="layui-btn layui-btn-xs jie-admin uncollect" data-id="{$PostInfo.id}" type="set" field="stick"
              rank="0"">取消收藏</span>
              {else}
              <span class=" layui-btn layui-btn-xs jie-admin collect" type="set" data-id="{$PostInfo.id}" field="stick"
              rank="1">收藏</span>
            {/if}
            {/if}
            <!-- <span class="layui-btn layui-btn-xs jie-admin" type="set" field="status" rank="1">加精</span>  -->
            <!-- <span class="layui-btn layui-btn-xs jie-admin" type="set" field="status" rank="0" style="background-color:#ccc;">取消加精</span> -->
          </div>
          <span class="fly-list-nums">
            <a href="#comment"><i class="iconfont" title="回答">&#xe60c;</i> {$PostInfo.comment_count}</a>
            <i class="iconfont" title="人气">&#xe60b;</i> {$PostInfo.visit_count}
          </span>
        </div>
        <div class="detail-about">
          <a class="fly-avatar" href="{:url('home/user/index', ['userid' => $PostInfo.userid])}">
            <img src="{$PostInfo.user.avatar_cdn}" alt="{$PostInfo.user.nickname}">
          </a>
          <div class="fly-detail-user">
            <a href="{:url('home/user/index', ['userid' => $PostInfo.userid])}" class="fly-link">
              <cite>{$PostInfo.user.nickname}</cite>
              <i class="iconfont icon-renzheng" title="认证信息：${$PostInfo.user.nickname}"></i>
              <i class="layui-badge fly-badge-vip">VIP {$PostInfo.user.vip}</i>
            </a>
            <span>{$PostInfo.createtime}</span>
          </div>
          <div class="detail-hits" id="LAY_jieAdmin" data-id="123">
            <span style="padding-right: 10px; color: #FF7200">悬赏：{$PostInfo.point}积分</span>
            {if condition="$PostInfo.userid == $userid && $PostInfo.accept == null"}
            <span class="layui-btn layui-btn-xs jie-admin" type="edit"><a
                href="{:url('home/post/edit', ['postid' => $PostInfo.id])}">编辑此贴</a></span>
            {/if}
          </div>
        </div>
        <div class="detail-body photos">
          {$PostInfo.content}
        </div>
      </div>

      <div class="fly-panel detail-box" id="flyReply">
        <fieldset class="layui-elem-field layui-field-title" style="text-align: center;">
          <legend>回帖</legend>
        </fieldset>

        <ul class="jieda" id="jieda">

          {if condition="$CommentList"}
          {:CommentHtml($CommentList, $PostInfo, $LoginUser)}
          {else /}
          <!-- 无数据时 -->
          <li class="fly-none">消灭零回复</li>
          {/if}
        </ul>

        <!-- 登录 并且 没被采纳 -->
        {if condition="$LoginUser && $PostInfo.accept == null"}
        <div id="reply"></div>
        <div class="layui-form layui-form-pane">
          <form action="{:url('home/comment/add')}" method="post">
            <div class="layui-form-item layui-form-text">
              <a name="comment"></a>
              <div class="layui-input-block">
                <textarea name="content" id="content" style="height: 300px;width:100%;"></textarea>
              </div>
            </div>
            <div class="layui-form-item">
              <input type="hidden" name="postid" value="{$PostInfo.id}">
              <input type="hidden" name="pid" value="0">
              <button class="layui-btn" lay-submit>提交回复</button>
            </div>
          </form>
        </div>
        {/if}
      </div>
    </div>
    <div class="layui-col-md4">
      <dl class="fly-panel fly-list-one">
        <dt class="fly-panel-title">本周热议</dt>
        <dd>
          <a href="">基于 layui 的极简社区页面模版</a>
          <span><i class="iconfont icon-pinglun1"></i> 16</span>
        </dd>
        <!-- 无数据时 -->
        <!--
        <div class="fly-none">没有相关数据</div>
        -->
      </dl>

      <div class="fly-panel" style="padding: 20px 0; text-align: center;">
        <img src="../../res/images/weixin.jpg" style="max-width: 100%;" alt="layui">
        <p style="position: relative; color: #666;">微信扫码关注 layui 公众号</p>
      </div>

    </div>
  </div>
</div>

<script>
  layui.use(['layer'], function () {
    var $ = layui.jquery,
    layer = layui.layer

    var editor = null
    KindEditor.ready(function (K) {
      editor = K.create('textarea[name="content"]');
    })

    // 回复
    $('.reply').click(function () {
      let pid = $(this).data('pid')
      $('input[name="pid"]').val(pid)
      let nickname = $(this).data('nickname')

      $("#reply").html(`<h1 style="color: blue">回复@${nickname}</h1>`)

      editor.focus()
    })

    // 采纳
    $('.accept').click(function() {
      let comid = $(this).data('comid')
      // console.log(comid)
      $.ajax({
        type: 'post',
        url: `{:url('home/Comment/accept')}`,
        data: {
          comid
        },
        dataType: 'json',
        success: function(res) {
          if (res.code === 1) {
            layer.msg(res.msg, { icon: 3}, function() {
              location.reload();
            }) 
          }else {
            layer.msg(res.msg, { icon: 5}) 
          }
        }
      })
    })

    // 删除帖子
    $('.del').click(function () {
      var id = $(this).data('id')
      layer.confirm('确定删除帖子？', { icon: 3, title: '提示' }, function (index) {
        // 发起请求
        $.ajax({
          type: 'post',
          url: `{:url('home/post/del')}`,
          data: {
            id
          },
          dataType: 'json',
          success: function (res) {
            if (res.code == 1) {
              layer.msg(res.msg, { icon: 1, time: 1500 }, function (index) {
                location.href = res.url
                layer.close(index)
              })
            } else {
              layer.msg(res.msg, { icon: 2, time: 1500 }, function (index) {
                layer.close(index)
              })
            }
          }
        })
        layer.close(index)
      })
    })

    // 收藏
    $('.fly-admin-box').on('click', '.collect', function () {
      var postid = $(this).data('id');
      layer.confirm('确定收藏帖子？', { icon: 3, title: '提示' }, function (index) {
        // 发起请求
        $.ajax({
          type: 'post',
          url: `{:url('home/collect/collect')}`,
          data: {
            postid
          },
          dataType: 'json',
          success: function (res) {
            if (res.code == 1) {
              layer.msg(res.msg, { icon: 1 }, function () {
                $('.collect').addClass('layui-bg-red').text('取消收藏').addClass('uncollect').removeClass('collect');
              })
            }
          }
        })
        layer.close(index)
      })
    })

    // 取消收藏
    $('.fly-admin-box').on('click', '.uncollect', function () {
      var postid = $(this).data('id');
      layer.confirm('确定取消收藏帖子？', { icon: 1, title: '提示' }, function (index) {
        // 发起请求
        $.ajax({
          type: 'post',
          url: `{:url('home/collect/collect')}`,
          data: {
            postid
          },
          dataType: 'json',
          success: function (res) {
            if (res.code == 1) {
              layer.msg(res.msg, { icon: 1 }, function () {
                $('.uncollect').removeClass('layui-bg-red').text('收藏').addClass('collect').removeClass('uncollect');
              })
            }
          }
        })
        layer.close(index)
      })
    })
  
    // 点赞
    $('.jieda-zan').click(function() {
      let id = $(this).data('id')
      $.ajax({
        type: 'post',
        url: `{:url('home/index/info')}`,
        data: {
          id,
          action: 'aaa'
        },
        dataType: 'json',
        success: function(res) {
          // console.log('like')
          if (res.code == 1) {
              location.reload();
          } else {
              location.reload();
          }
        }
      })

    })
  
    $('.del-com').click(function() {
      let id = $(this).data('id')
      layer.confirm('确定该评论？', { icon: 3, title: '提示' }, function (index) {
        // 发起请求
        $.ajax({
          type: 'post',
          url: `{:url('home/index/info')}`,
          data: {
            'id': id,
            'action': 'delCom'
          },
          dataType: 'json',
          success: function (res) {
            if (res.code == 1) {
              layer.msg(res.msg, { icon: 1 }, function () {
                location.reload();
              })
            } else {
              layer.msg(res.msg, { icon: 1 }, function () {
                location.reload();
              })
            }
          }
        })
        layer.close(index)
      })
    })

  })
</script>